<#cenluan title="活动" menu="activity">
	<div class="row offcanvas-row offcanvas-row-right" id="offcanvas">
		<div class="col-sm-8">
			<ul class="nav nav-tabs mb20" role="tablist">
				<%if(isEmpty(show)||"new"==show){%>
					<li class="active"><a>最新发布</a></li>
				<%}else{%>
					<li><a href="/activity">最新发布</a></li>
				<%}%>
				<%if("recent"==show!){%>
					<li class="active"><a>即将开始</a></li>
				<%}else{%>
					<li><a href="/activity?show=recent">即将开始</a></li>
				<%}%>
				<%if(!isEmpty(session.user)){%>
					<%if("mine"==show!){%>
						<li class="active"><a>我发起的</a></li>
					<%}else{%>
						<li><a href="/activity?show=mine">我发起的</a></li>
					<%}%>
				<%}%>
				
				<li class="pull-right visible-xs">
					<a href="#offcanvas" data-toggle="offcanvas">&gt;&gt;</a>
				</li>
			</ul>
			<%for(activity in page.list){%>
				<div class="media">
					<a class="media-left">
						<img src="${activity.creater.avatarUrl}" class="img-rounded avatar-md">
					</a>
					<div class="media-body">
						<h4 class="media-heading">
							<a href="/activity/show/${activity.id}">${activity.title,xss}</a>
						</h4>
						<p class="text-muted small">
							${activity.createTime,prettyTime}&nbsp;by&nbsp;${activity.creater.html}&nbsp;
							<%if(activity.end<date()){%>
								<span class="text-danger">活动已经于${activity.end,prettyTime}结束</span>
							<%}else if(activity.start<date()){%>
								<span class="text-warning">活动已经于${activity.start,prettyTime}开始</span>
							<%}else if(activity.start>date()){%>
								<span class="text-success">活动即将于${activity.start,prettyTime}开始</span>
							<%}%>
						</p>
					</div>
				</div>
				<%if(!activityLP.last){%>
				<hr class="dashed">
				<%}%>
			<%}elsefor{%>
				<p>无可显示数据</p>
			<%}%>
			${pageLink}
		</div><!-- col-sm-8 -->
		<div class="col-sm-4 offcanvas-sidebar">
			<div class="panel panel-default">
				<div class="panel-body text-center">
					<p>你有什么好的出行计划？带上小伙伴一起去吧！</p>
					<p class="mb0">
						<a class="btn btn-primary btn-sm" href="/activity/add">
							<span class="glyphicon glyphicon-plus"></span>&nbsp;发起活动
						</a>
					</p>
				</div>
			</div>
		</div><!-- col-sm-4 -->
	</div>
</#cenluan>